<html>
	<head>
		<title>Persevere Examples</title>
		<script src="js/persevere.js"></script> <!-- include the persistence framework -->
		<link rel="stylesheet" type="text/css" href="examples/examples.css"/>
	</head>
	<body>
		<h1>Persevere Examples</h1>
		These examples are intended to demonstrate how to use Persevere with persisted applications.
		To see the source for this demonstration, go to the <a href="browser.html?id=root.examples">JSPON Object browser</a>
		and open the customersApp property. The expanded properties represent the
		different methods that compose this application.
		These examples should work as is
		if you have download and installed the <a href="http://www.xucia.com/page/Jsponic">Jsponic server</a>.

		<h1>Customers Example</h1>
		<a href="#" onclick="customersApp.renderCustomers()">List Customers</a> (using server side JavaScript)
		Filter: <input type="text" id="searchInput" />
		<div id="customersDiv"></div> <!-- we render the customers in this div -->
		<div id="customerFields" style="display:none">
			<fieldset>
				<legend>Edit the customer</legend>
				<div><label for="firstName">First Name:</label><input type="text" name="firstName" /></div>
				<div><label for="lastName">Last Name:</label><input type="text" name="lastName" /></div>
				<div><label for="address">Address:</label><input type="text" name="address" /></div>
				<div><label for="phoneNumber">Phone Number:</label><input type="text" name="phoneNumber" /></div>
				<div><label for="comment">Comment:</label><input type="text" name="comment" /></div>
				<button id="customerOk">OK</button>
				<button id="customerDelete">Delete</button>
			</fieldset>
		</div>
		<button onclick="customersApp.addCustomer()">Add new customer</button>
		<script>
		pjs.load("root",function(root) {
			pjs.get(root,'examples',function(examples) {
				customersApp = examples.customersApp;
				customersApp.renderCustomers();
			});
		});
		</script>
		


	</body>
</html>